<!--开户-->
<template>
  <div class="count">
    <div class="count-header">
      <div class="count-header-logo">
        <router-link to="/">
          <img src="../../../assets/logo.gif" alt="logo" />
        </router-link>
      </div>
      <div class="count-header-title">
        <h2>个人开户中心</h2>
      </div>
    </div>
    <div class="count-contain">
      <div class="count-contain-left">
        <div class="count-contain-left-form">
          <!-- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
            <el-form-item style="margin-top: 10%;width: 100%" prop="phoneNum">
              <el-input v-model="ruleForm.accountName" placeholder="手机号" maxlength="11"></el-input>
            </el-form-item>
            <el-form-item style="margin-top: 10%;width: 60%;position: relative" prop="checkNum">
              <el-input v-model="ruleForm.checkNum" maxlength="6" placeholder="验证码"></el-input>
              <el-button
                id="button"
                @click="getNum('ruleForm')"
                type="danger"
                style="position: absolute;top:1px;left:175px"
              >发送验证码</el-button>
            </el-form-item>
            <p style="color:#fff;">若您未收到验证码,请拨打客服热线:95357</p>
            <el-button id="btn" type="warning" @click="submitForm('ruleForm')">马上开户</el-button>
          </el-form> -->
        </div>
      </div>
      <div class="count-contain-right"></div>
    </div>
    <!-- <footer></footer> -->
  </div>
</template>
<script>
export default {
  data() {
    return {
      text: "",
      input: ""
    };
  },
  methods: {
  }
};
</script>
<style scoped>
  #btn {
    width: 100%;
    margin-top: 10px;
  }
  .count {
    width: 1000px;
    margin: 10px auto;
  }
  .count-header {
    width: 1000px;
    height: 92px;
    margin: 0 auto;
    position: relative;
  }
  .count-header-logo img {
    margin-top: 30px;
  }
  .count-header-title {
    width: 200px;
    height: 55px;
    position: absolute;
    left: 130px;
    top: 25px;
    text-align: center;
    letter-spacing: 3px;
    border-left: 1px solid #ccc;
    line-height: 55px;
  }
  .count-contain {
    width: 100%;
    height: 500px;
    border-top: 2px solid #2f5895;
    border-bottom: 2px solid #2f5895;
    background: url("../../../assets/banner_pckaihu.jpg");
  }
  .count-contain-left {
    margin: 20px 0;
    float: left;
    width: 500px;
    height: 460px;
    border-right: 1px solid #dcdcdc;
    font-family: "Microsoft YaHei";
  }
  .count-contain-left-form {
    margin: 10% auto;
    width: 290px;
    background: rgba(0, 0, 0, 0.5);
    padding: 36px 20px;
  }
  .count-contain-right {
    position: absolute;
    top: 240px;
    right: 188px;
    display: inline-block;
    *display: inline;
    zoom: 1;
    width: 468px;
    height: 151px;
    background: url("../../../assets/unit-a.png") no-repeat;
  }
</style>
